<template>
  <div class='logregister'>
    <van-nav-bar left-arrow title="登录" @click-left="onClickLeft" />
    <van-form @submit="Login">
      <van-field v-model="name" name="username" label="账号" maxlength="11" placeholder="请输入账号" left-icon="phone-circle-o"
        :rules="[{ required: true,message:'请输入11位数'}]" />
      <van-field v-model="pwd" type="password" label="密码" placeholder="请输入密码" left-icon="closed-eye"
        :rules="[{ required: true,}]" />
      <div style="margin: 16px;">
        <van-button round block type="info" native-type="submit">
          登录
        </van-button>
        <van-button type="primary" to="/Register" size='mini'>没有账号?马上注册!</van-button>
      </div>
    </van-form>
  </div>
</template>
<script>
  // import { Toast } from 'vant'
  export default {
    data() {
      return {
        name: '',
        pwd: ''
      }
    },
    methods: {
      // 返回上级
      onClickLeft() {
        // Toast('返回')
        this.$router.push('/home')
        // window.history.back()
      },
      onSubmit(values) {
        // console.log('submit', values)
        //  Toast('登录成功')
      },
      async Login() {
        try {
          let prams = {
            name:this.name,
            pwd:this.pwd
          }
         
          const res = await this.$Api.apiUser.Login(prams)
          if (res.status == -200)return this.$Toast('登录失败')
          // 设置token
          // this.$store.commit('setUserInfo',res.data.data.user)
          localStorage.setItem('userinfo', JSON.stringify(res.data.user))

         
          // 登陆成功 假设这里是后台返回的 token
          localStorage.setItem('token', res.data.token)
          this.$Toast('登录成功')
          this.$router.push('/home')
        } catch (error) {
          console.log(error)
        }
      }
    }
  }

</script>
<style lang="less" scoped>
  .van-form {
    margin: 0 10%;
    margin-top: 40%;
  }

  .van-cell {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    box-sizing: border-box;
    width: 100%;
    padding: 10px 16px;
    overflow: hidden;
    color: #323233;
    font-size: 14px;
    line-height: 24px;
  }

  .van-button--info {
    margin: 15% 0 5% 0;
    background: rgb(255, 87, 119);
    border: none;
  }

  .van-field__label {
    -webkit-box-flex: 0;
    -webkit-flex: none;
    flex: none;
    box-sizing: border-box;
    width: 6.2em;
    margin-right: -34px;
    color: #646566;
    text-align: left;
    word-wrap: break-word;
  }

  .van-button--mini {
    margin-left: 30%;
    border: 0px;
    color: #0fcee0;
    background-color: #fff;
  }

</style>
